<template>
	<view class="contractAll">
		<view class="contractLeft" :class="imgType === 'icon'?'contractLeftIcon':'contractLeftImg'" :style="'background-image:url('+imgSrc+')'"></view>
		<view class="contractRight">
			<view class="contractText">
				<view class="contractTextName">
					<text>{{fileName}}</text>
				</view>
				<view>
					<text>{{fileAuthor}}</text>
				</view>
				<view class="fileDate">
					<text>{{fileDate}}</text>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			fileName: String,
			fileDate: String,
			fileAuthor: String,
			imgSrc: String,
			imgType: String,
		},
		data() {
			return {
				// IconPath: require('../../static/index/pdfIcon.png')
			};
		},
		methods: {
			downFile() {
				console.log('下载')
				// uni.downloadFile({
				// 	url: 'https://www.example.com/file/test', //仅为示例，并非真实的资源
				// 	success: (res) => {
				// 		if (res.statusCode === 200) {
				// 			console.log('下载成功');
				// 		}
				// 	}
				// });
			}
		}
	}
</script>

<style scoped>
	.contractAll {
		/* width: 100%; */
		height: 100%;
		padding: 10.66upx;
		display: flex;
		flex-wrap: nowrap;
		background-color: #fdf5f3;
		border-radius: 10upx;
	}

	.contractLeft {
		background-color: #FFF;
		height: 100%;
		width: 38%;
		background-position: center;
		background-repeat: no-repeat;
		border-radius: 15upx;
	}
	.contractLeftIcon{
		background-size: 80%;
	}
	.contractLeftImg{
		background-size: cover;
	}

	.contractRight {
		overflow: hidden;
		position: relative;
		padding-left: 18upx;
		width: 62%;
	}

	.contractText {
		width: 100%;
		height: 100%;
		font-size: 20upx;
		color: #666666;
	}
	.contractTextName{
		font-weight: 600;
	}
	.contractText text {
		display: inline-block;
		margin-bottom: 3upx;
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
		width:100%;
	}
	.fileDate{
		bottom:0;
		position: absolute;
	}
</style>
